<template>
 	<a-row>
 		<a-form :layout="formLayout"  :form="form"  @submit="handleSubmit">
		      <a-form-item
		        label="公司名称"
		        :label-col="formItemLayout.labelCol"
		        :wrapper-col="formItemLayout.wrapperCol"
		      >
		        <a-input placeholder="请输入公司名称"  v-decorator.trim="['name', baseform.name]" /> 
		      </a-form-item> 
		      <a-form-item   
		        label="客户类型"
		        :label-col="formItemLayout.labelCol"
		        :wrapper-col="formItemLayout.wrapperCol"
		      >
		        <a-radio-group  v-decorator="['supOrBuyer',baseform.supOrBuyer]">
			      <a-radio value="1">供应商</a-radio>
			      <a-radio value="2">买方</a-radio>
			      <a-radio value="3">供应商和买方</a-radio>
			      <a-radio value="4">代理方</a-radio>
			      <a-radio value="0">待确认</a-radio>
			    </a-radio-group>
		        
		      </a-form-item>
		      <a-form-item
		        label="联系人"
		        :label-col="formItemLayout.labelCol"
		        :wrapper-col="formItemLayout.wrapperCol"
		      >
		      	<a-input placeholder="请输入"  v-decorator="['contact',baseform.contact]"/>
		      </a-form-item>
		      <a-form-item
		        label="电话"
		        :label-col="formItemLayout.labelCol"
		        :wrapper-col="formItemLayout.wrapperCol"
		      >
		      	<a-input placeholder="请输入客户电话"  v-decorator="['phone',baseform.phone]"/>
		      </a-form-item>
		      <a-form-item
		        label="邮箱"
		        :label-col="formItemLayout.labelCol"
		        :wrapper-col="formItemLayout.wrapperCol"
		      >
		      	<a-input placeholder="请输入客户邮箱"  v-decorator="['email',baseform.email]"/>
		      </a-form-item>
		      <a-form-item
		        label="网址"
		        :label-col="formItemLayout.labelCol"
		        :wrapper-col="formItemLayout.wrapperCol"
		      >
		      	<a-input placeholder="请输入客户网址"  v-decorator="['website']"/>
		      </a-form-item>
		      <a-form-item
		        label="其他"
		        :label-col="formItemLayout.labelCol"
		        :wrapper-col="formItemLayout.wrapperCol"
		      >
		      	<a-textarea placeholder="请输入" :rows="4"  v-decorator="['remark']"/>
		      </a-form-item>
		      <a-form-item style='display: none'>
		      	<a-input  v-decorator = '["code"]' />
		      </a-form-item>

		      <a-form-item

		        :wrapper-col="buttonItemLayout.wrapperCol"
		      >
		        <a-button type="primary"  html-type="submit"  class='mr20'>
		          <span  v-if='isEdit == false'>添加</span>
		          <span  v-else>提交</span>
		        </a-button>
		        <router-link to='/customer'><a-button >取消</a-button></router-link>
		      </a-form-item>
    	</a-form>
 	</a-row>
</template>

<script>
import  { submitEnt,DetailEnt }  from  '@/api/customer/index'
export default {
  name: 'customerAdd',
  data () {
    return {
    	/*form  布局*/
      	formLayout:'horizontal',
      	baseform:{
      		name: {rules: [{ required: true, message: '请输入客户名称' },{ whitespace : true ,message:'当前输入不能为空'}]},
      		supOrBuyer:{rules: [{ required: true, message: '请选择客户类型' },{ whitespace : true ,message:'当前选择不能为空'}]},
      		contact:{rules:[{ required: true, message: '请输入' },{ whitespace : true ,message:'当前输入不能为空'}]},
      		phone:{rules:[{ required: true, message: '请输入' },{ whitespace : true ,message:'当前输入不能为空'}]},
      		email:{rules:[{ required: true, message: '请输入' },{ whitespace : true ,message:'当前输入不能为空'}]},
      	},

	    isEdit:false,
	    currentEntCode:'',
    }
  },
  beforeCreate () {
    this.form = this.$form.createForm(this);
  },
  created(){
  	if(this.$route.path == '/customer/edit'){
  		this.isEdit = true
  		this.currentEntCode = this.$route.query.code
  		this.pageInit()
  	}
  },
  methods:{
  		pageInit(){
  			DetailEnt(this.currentEntCode).then((res)=>{
  				if(res.data.flag == true){
  					let data = res.data.data
  					this.form.setFieldsValue({
  						name:data.name,
  						supOrBuyer:data.supOrBuyer,

  						contact:data.contact,
  						phone:data.phone,
  						email:data.email,
  						website:data.website,
  						remark:data.remark,
  						code:data.code,
  					})
  				}
  			})
  		},

  		/*提交表单*/
  		handleSubmit (e) {
			e.preventDefault();
			let that = this , url
			// console.log(this.form.getFieldsValue())
			this.form.validateFields((err, values) => {
			if (!err) {
			  // console.log('Received values of form: ', values);
			  if(that.isEdit == true){
			  	url = '/op/ent/modify_ent'
			  }
			  else{
			  	url = '/op/ent/create_ent'
			  }
			  submitEnt(url,values).then((res)=>{ 
			  		this.$message.success(res.data.msg)
			  		this.$router.push('/customer') 
			  })
			}
			else{
				console.log(err)
			}
			});
		},
		
  },
  computed: {
    formItemLayout () {
      const { formLayout } = this;
      return formLayout === 'horizontal' ? {
        labelCol: {md:{span:5},lg:{ span: 7 }},  //label 标签布局
        wrapperCol: {xxl:{ span: 8 },xl:{ span : 11},lg:{ span :14 },md:{ span : 16 },xs:{ span :24}}, //需要为输入控件设置布局样式时，使用该属性，用法同 labelCol
      } : {};
    },
    buttonItemLayout () {
      const { formLayout } = this;
      return formLayout === 'horizontal' ? {
        wrapperCol: { span: 14, offset: 7 },
      } : {};
    },
  },
  
  components:{
  	
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
	/*客户维护记录*/
.tipdiv{margin-left: 100px;margin-top: -20px;}
</style>
